<!-- 自定义 tabBar 组件 -->
<template>
  <u-tabbar
    :value="currentVal"
    :placeholder="false"
    :fixed="true"
    :border="false"
    :safeAreaInsetBottom="false"
  >
    <u-tabbar-item
      v-for="(item, index) in tabList"
      :name="item.name"
      :text="item.text"
      :icon="item.icon"
      @click="handleTabBarChange(item)"
    ></u-tabbar-item>
  </u-tabbar>
</template>

<script>
export default {
  props: {
    current: {
      type: [String, Number],
      default: "home"
    }
  },
  data() {
    return {
      currentVal: "",
      tabList: [
        {
          name: "home",
          text: "首页",
          icon: "home",
          pagePath: "/pages/index/index"
        },
        {
          name: "profile",
          text: "我的",
          icon: "account",
          pagePath: "/pages/profile/index"
        }
      ]
    };
  },
  mounted() {
    this.currentVal = this.current;
  },
  methods: {
    handleTabBarChange(row) {
      uni.switchTab({
        url: row.pagePath
      });
    }
  }
};
</script>

<style></style>
